@import "~@/assets/styles/homePage/index.less"; /* 首页样式 */ 
@import "~@/assets/styles/homePage/announcementList.less"; /* 首页公告列表样式 */ 
@import "~@/assets/styles/aiQuantization/index.less"; /* ai量化样式 */ 
@import "~@/components/comQuantizationInvestmentPopup/index.less"; /* ai量化底部弹窗样式 */
@import "~@/assets/styles/chatTools/index.less"; /* 聊天 */ 
@import "~@/assets/styles/personalCenter/index.less"; /* 个人中心 */ 
@import "~@/components/comFlashExchangeRadio/index.less"; /* 闪兑选择币种组件样式 */
@import "~@/assets/styles/login/index.less"; /* 登录页样式 */
@import "~@/components/comConfirmDialog/index.less"; /* 注册页样式 */

@tabbar-bc:#20325B;
@box-background-color: #0C1527; /* 主体背景色 */ 
@card-background-color: #101D34; /* 卡片背景色 */ 
@subhead-color:#5D6B8C; /* 副标题颜色 */ 
@sa-success:#32D2B9; /* 成功 */
@sa-error:#FF797A; /* 错误 */
@sa-warning:#F7A600; /* 警告 */
@sa-processing:#0064B8; /* 处理中 */
@while:#FFFFFF; /* 白色 */
@black:#000000; /* 黑色 */
@btn-background-color:#0086FF; /* 按钮及弱标题背景色 */ 
@inp-background-color:#0B213D; /* 输入背景色 */

/* 隐藏火狐浏览器 input[type=number] 的上下箭头 */
input[type=number] {
    -moz-appearance: textfield;
}
  
/* 隐藏 Chrome、Safari 等 Webkit 浏览器的上下箭头 */
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}

/* 覆盖 Vant Toast 样式 */
.van-toast {
    max-width: 320px;      /* 设置最大宽度 */
    width: auto !important;
    word-break: break-word; /* 换行但不强行截断单词 */
    white-space: pre-line;  /* 保留换行 */
}

.van-toast__text {
    word-break: break-word;
    white-space: pre-line;
}

van-tab__text {
    word-break: break-word;
    white-space: pre-line;
}

/*全局字体大小*/
@font-size-text:0.9rem;

/* 全局样式 */ 
#spaceAI_app,*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    border: none;
}

#spaceAI_app{
    overflow-x: hidden;
}

html{
    background-color: @box-background-color;
}
/* 全局class调整 */ 
.margin-1{
    margin: 1rem!important;
}
.mb-0{
    margin-bottom: 0.5rem!important;
}
.mb-1{
    margin-bottom: 1rem!important;
}
.mb-2{
    margin-bottom: 2rem!important;
}
.mb-3{
    margin-bottom: 3rem!important;
}
.mt-0{
    margin-top: 0.5rem !important;
}
.mt-1{
    margin-top: 1rem !important;
}
.mt-2{
    margin-top: 2rem !important;
}
.mt-3{
    margin-top: 3rem !important;
}
.mt-4{
    margin-top: 4rem !important;
}
.mr-0{
    margin-right: 0.5rem!important;
}
.mr-1{
    margin-right: 1rem!important;
}
.ml-0{
    margin-left: 0.5rem!important;
}
.ml-1{
    margin-left: 1rem!important;
}
.padding-1{
    padding: 1rem !important;
}
.padding-0{
    padding: 0.5rem!important;
}
.pt-0{
    padding-top: 0.5rem!important;
}
.pt-1{
    padding-top: 1rem !important;
}
.pt-2{
    padding-top: 2rem !important;
}
.pt-3{
    padding-top: 3rem !important;
}
.pl-1{
    padding-left: 1rem !important;
}
.pl-2{
    padding-left: 2rem !important;
}
.pr-1{
    padding-right: 1rem!important;
}
.pr-2{
    padding-right: 2rem!important;
}
.pb-0{
    padding-bottom: 0.5rem!important;
}
.pb-1{
    padding-bottom: 1rem!important;
}
/* 圆角 */ 
.br-8{
    border-radius: 8px !important;
}
.br-16{
    border-radius: 16px!important;
}
.br-24{
    border-radius: 24px!important;
}
/* 字体 */ 
.fs-24{
    font-size: 24px !important;
}
.fs-26{
    font-size: 26px !important;
}
.fs-28{
    font-size: 28px !important;
}
.fs-30{
    font-size: 30px !important;
}
.fs-32{
    font-size: 32px !important;
}
.fs-36{
    font-size: 36px !important;
}
.fs-40{
    font-size: 40px !important;
}
/* 对齐 */ 
.font-right{
    text-align: right!important;
}
.font-left{
    text-align: left!important;
}
.font-center{
    text-align: center!important;
}
/* 行高+字体大小 */ 
.fs-lh-1{
    font-size: @font-size-text;
    line-height: 1.7rem;
}
.fs-lh-2{
    font-size: @font-size-text;
    line-height: 2.2rem;
}

/* 字体颜色 */ 
.fc-w{
    color: @while ;
}

/* 图片大小 */ 
.img-s{
    width: 2.5rem;
    height: auto;
}


/* vant 样式统一更改 */ 
/* 底部导航 */ 
.van-tabbar{
    background-color: @tabbar-bc !important;
    border-color: @tabbar-bc !important;
}
.van-tabbar-item--active{
    background-color: @tabbar-bc !important;
}
.van-tabbar-item__icon img{
    width: 2rem;
    height: 2rem;
}
.van-hairline--top-bottom::after, .van-hairline-unset--top-bottom::after{
    border-width:0 0!important;
}
/* 首页滚动通知栏 */ 
.van-notice-bar{
    padding-left: 0!important;
}
.van-notice-bar__left-icon, .van-notice-bar__right-icon {
    min-width:40px!important;
}

/* 首页tab */ 
.homePage_container .van-tabs__nav {
    flex-wrap: nowrap !important; /* 禁止换行 */ 
    overflow-x: auto !important;  /* 启用横向滚动 */ 
}
.homePage_container .van-tab{
    margin: 0 0.3rem!important;
    padding: 0.3rem 0.8rem!important;
    border-radius: 15px !important;
    line-height: 14px!important;
    background-color: #0B213D;
    color: @subhead-color;
}
.homePage_container .van-tabs__nav--card{
    height: auto !important;
}
.homePage_container .van-tab.van-tab--active{
    background-color: @btn-background-color;
}
.homePage_container .van-tabs__wrap.van-tabs__wrap--scrollable{
    margin-bottom:0.5rem!important;
}
.homePage_container .van-tabs__nav.van-tabs__nav--card.van-tabs__nav--complete,.homePage_container .van-tabs__nav.van-tabs__nav--card.van-tabs__nav--complete div{
    border: none !important;
}

/* 顶部navBar */ 
.van-nav-bar.van-hairline--bottom{
    background-color: @box-background-color!important;
}

[class*=van-hairline]::after{
    border:none !important;
}

.van-nav-bar.van-hairline--bottom .van-nav-bar__left{
    padding: 0 0.8rem!important;
    
}
.van-icon.van-icon-arrow-left.van-nav-bar__arrow{
    font-size: 20px !important;
    color: #ffffff;
}

.van-nav-bar__content{
    height: 50px !important;
}
/* 公告cell */ 
.announcement_container .van-cell.van-cell--center{
    background-color: @box-background-color;
    min-height: 8vh!important;
    border: none!important;
}
.announcement_container .announcementLabel{
    width: 40vw;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.announcement_container .van-cell.van-cell--center img{
    margin: 0 1rem!important;
}
.announcement_container .van-cell::after{
    left: 4rem!important;
    border-bottom-color: #252D3D!important;
}
// 钻石购买弹出层
.diamondRecharge_popup{
    background-color: @box-background-color!important;
    .diamondRecharge_popup_header{
        width: 100%;
        height: 30px;
        display: flex;
        align-items: center;
        color: #ffffff;
        .header_item{
            padding: 0.3rem 0.8rem;
            border-radius: 25px;
            background-color: rgba(255,255,255, 0.1);
            display: flex;
            align-items: center;
            img{
                width: 1rem;
                margin-right: 0.3rem;
            }
        }
    }
    .diamondRecharge_popup_imgs{
        width: 100%;
        height: 150px;
        .gradient-circle-container {
            width: 150px;
            height: 150px;
            margin: 0 auto;
            position: relative;
            border-radius: 50%;
            background: radial-gradient(
                circle at center,
                rgba(149, 113, 241, 0.9) 0%,
                rgba(149, 113, 241, 0.7) 20%,
                rgba(149, 113, 241, 0.5) 40%,
                rgba(149, 113, 241, 0.2) 70%,
                rgba(149, 113, 241, 0.1) 80%,
                rgba(149, 113, 241, 0.1) 100%,
                transparent 100%
            );
            display: flex;
            justify-content: center;
            align-items: center;
            .center-image {
                width: 150px;
                height: 150px;
                border-radius: 50%;
                object-fit: cover;
                z-index: 1;
                box-shadow: inset 0 0 10px rgba(149, 113, 241, 0.1);
            }
            /* 添加伪元素模糊边界 */
            &::after {
                content: '';
                position: absolute;
                width: 100%;
                height: 100%;
                border-radius: 50%;
                background: transparent;
                border: none;
                box-shadow: 
                    0 0 35px 25px rgba(149, 113, 241, 0.2),
                    0 0 70px 70px rgba(149, 113, 241, 0.1);
                z-index: 0;
                filter: blur(1px);
            }
        }
    }
    .diamondRecharge_popup_content{
        width: 100%;
        height: 180px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .content_item{
            width: 31%;
            height: 180px;
            background-color: @card-background-color;
            border-radius: 16px;
            box-sizing: border-box;
            transition: all 0.2s ease;
            position: relative;
            img{
                position: relative;
                top: -15px;
                width: 2.5rem;
            }
            .content_item_num{
                font-size: 1.5rem;
                font-weight: 550;
            }
            .content_item_text{
                font-size: 0.8rem;
                color: @subhead-color;
            }
            .content_item_price{
                font-size: 0.9rem;
            }
            // 选中状态样式
            &.active {
                transform: scale(1.05); // 轻微放大效果
                box-shadow: 0 0 15px rgba(0, 134, 255, 0.5);
            }
            
            // 确保内部元素不会影响容器尺寸
            img, .content_item_num, .content_item_text, .content_item_price {
                transition: none;
                position: relative;
                z-index: 1;
            }
        }
        .active{
            border: 1px solid rgba(149, 113, 241, 0.9);
        }
    }
    button{
        width: 95%;
        height: 45px;
        font-size: 0.9rem;
        background-color: @btn-background-color;
        border-radius: 25px;
    }
}
// 下载图片按钮
.btn_download{
    z-index: 9999;
    padding: 0.3rem 0.9rem;
    border: 1px dashed #fff;
    color: #fff;
    position: fixed;
    bottom: 10vh;
    left: 50%;
    border-radius: 25px;
    transform: translateX(-50%);
}